<!DOCTYPE html >
<html xmlns:th="http://www.thymeleaf.org">
	<head>
		<title th:inline="text">[[#{template}]]</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<link rel="stylesheet" type="text/css" media="all" href="../../css/style.css" th:href="@{/css/style.css}" />
		<script src="../../js/functions.js" th:src="@{/js/functions.js}"></script>
		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
		<script>
			function save() {
				$.ajax({
					type: 'POST',
					url: '/template/templates',
					dataType: 'json',
					data : {
						"name" : $("#name").val(),
						"templateRef" : $("#templateRef").val()
					},
					//data: {"_method" : method},
					success: function (data) {
						if (data.response.type == SUCCESS) {
							window.location.href = "/template/templates";
						} else if (data.response.type == ERROR) {
							
						} else if (data.response.type == VALIDATION_ERROR) {							
							if (data.response.errors.hasOwnProperty('name')) {
								$("#name").addClass("fieldError");
								$("#errors").html(data.response.errors.name);
								$("#errors").show();
							}
							if (data.response.errors.hasOwnProperty('templateRef')) {
								$("#templateRef").addClass("fieldError");
							}
						}
					},
					error: function(jqXHR, textStatus, errorThrown){						
						alert("error: " + textStatus + " exception: " + errorThrown);						
					}
				});
			}
		</script>
	</head>
	<body>
	  	<span style="float: right">  	
		    <a href="?lang=en_US" th:href="@{'javascript:lang(\''+${#httpServletRequest.requestURI}+${#strings.isEmpty(#httpServletRequest.queryString)?'':'?'+#httpServletRequest.queryString}+'\', \'en_US\');'}">US</a>
		    |
		    <a href="?lang=pt_BR" th:href="@{'javascript:lang(\''+${#httpServletRequest.requestURI}+${#strings.isEmpty(#httpServletRequest.queryString)?'':'?'+#httpServletRequest.queryString}+'\', \'pt_BR\');'}">BR</a>
		</span>
		<!-- <form action="list.html" th:action="@{#}" th:object="${template}" th:method="${template.new} ? 'post' : 'put'"> -->
		<!-- <form action="list.html" th:action="@{${template.new} ? '/templates' : '/templates/' + *{id}}" th:object="${template}" th:method="${template.new} ? 'post' : 'put'"> -->
		<!-- <form action="list.html" th:action="@{#}" th:object="${obj}" > -->
		<div th:object="${obj}" >
			<fieldset>
	
				<legend th:text="#{template}">Template</legend>
				
				<!-- <ul th:if="${response.hasErrors()}" class="errorlist">
					<li th:each="err : ${response.getErrors()}" th:text="${err}">Input is incorrect</li>
				</ul> -->
				
				<div id="errors" class="errorlist">AAA</div>
	
				<div>
					<label for="name" th:text="#{name}">Name</label>
					<input id="name" type="text" th:field="*{name}" th:class="${response.hasErrors('name')} ? 'fieldError'" />
				</div>
	
				<div>
					<label for="templateRef" th:text="#{templateRef}">Template Ref</label>
					<!-- <input type="text" th:field="*{templateRef}" th:class="${response.hasErrors('templateRef')} ? 'fieldError'" /> -->
                    <select id="templateRef" th:field="*{templateRef}">
                        <option th:each="t : ${templateRefs}" th:text="${t}" th:value="${t.id}" >Template Ref 1</option>
                    </select>
				</div>
				
				<div class="submit">
	            	<input th:if="${obj.new}" type="button" value="Add" th:value="#{add}" onclick="save();" />
	            	<input th:unless="${obj.new}" type="button" value="Update" th:value="#{update}" onclick="update();" />
	          	</div>
	
			</fieldset>
		</div>
	<!-- </form> -->
	</body>
</html>